<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.org/ui">
   
    <ui:composition template="/views/_template.xhtml">
    	<ui:define name="corpo"> 
            <h:form>
                <h:messages style="color: red; text-align:center"/>
                <p:outputLabel value="Incluir Conta" style="border-bottom: 3px solid #C22; text-align: left; font-size: 20px; width: 900px; "
                               rendered="#{empty contaBean.conta.id}"/>
                <p:outputLabel value="Alterar Conta" style="border-bottom: 3px solid #C22; text-align: left; font-size: 20px; width: 900px; "
                               rendered="#{not empty contaBean.conta.id}"/>
               
                <h:dataTable styleClass="dadosForm" style="border: 1px solid #E4E4E4">
                    <h:column>
                    <f:facet name="header">
                        <h:outputLabel style="margin: 5px; text-align: left" value="Nome da conta" />
                    </f:facet>
                    <f:facet name="footer">
                        <p:inputText  value="#{contaBean.conta.nome}" 
                                      required="true" requiredMessage="Informe o nome da conta" validator="#{contaBean.validateNomeIguais}" />
                    </f:facet>
                    </h:column>
                    
                    <h:column>
                        <f:facet name="header">
                            <h:outputLabel style="margin: 5px;text-align: left;" for="da" value="Data de abertura" />
                        </f:facet>
                        <f:facet name="footer" >
                            <p:calendar id="da" pattern="dd/MM/yyyy" value="#{contaBean.conta.dataAbertura}"  
                                       required="true" requiredMessage="Informe a data de abertura." />
                        </f:facet>
                    </h:column>
                    
                    <h:column>
                        <f:facet name="header">
                            <h:outputLabel style="margin: 5px; text-align: left;" value="Saldo" for="saldo" />
                        </f:facet>
                        <f:facet name="footer">
                            <p:inputText style="width: 200px; text-align: right" id="saldo" value="#{contaBean.conta.saldo}" styleClass="moeda" 
                                         required="true" requiredMessage="Informe o saldo da conta">
                                <f:convertNumber minFractionDigits="2" maxFractionDigits="2" locale="pt_BR" />
                            </p:inputText>
                        </f:facet>
                    </h:column>
                </h:dataTable>

                <h:dataTable styleClass="dadosForm" style="border: 1px solid #E4E4E4" >
                    
                    <h:column>
                        <f:facet name="header">
                            <h:outputLabel style="margin: 5px;text-align: left;" value="Situação" />
                        </f:facet>
                        <f:facet name="footer">
                            <p:inputText value="#{contaBean.conta.situacao}" disabled="true" />
                        </f:facet>
                    </h:column>
                    
                    <h:column>
                        <f:facet name="header">
                            <h:outputLabel style="margin: 5px; text-align: left;" value="Tipo de Conta"  />
                        </f:facet>
                        <f:facet name="footer">
                            <p:selectOneMenu value="#{contaBean.tipodeConta}" style="padding-left: 2px; width: 200px;"  
                                                                              required="true" requiredMessage="Informe o tipo de conta">
                                <f:selectItem itemLabel="Informe o tipo de conta" noSelectionOption="true"/>
                                <f:selectItems value="#{contaBean.tipoConta}"  var="lista" itemLabel="#{lista.tipoConta}"/>
                                <p:ajax listener="#{contaBean.desabilitarInclusaoDadosBancarios}" update="dadosBancarios" />
                            </p:selectOneMenu>
                        </f:facet>
                    </h:column>
                    
                    <h:column>
                        <f:facet name="footer">
                            <p:commandButton id="dadosBancarios" value="Incluir dados Bancários" actionListener="#{contaBean.apresentarDadosBancarios}" ajax="false"
                                             rendered="#{empty contaBean.conta.id}" disabled="#{contaBean.habilitarBotao}"/>
                        </f:facet>
                    </h:column>
                    
                 </h:dataTable>
                
                <p:panel rendered="#{contaBean.exibirDadosBancarios}" >
                    <h:dataTable styleClass="dadosForm" style="border: 1px solid #E4E4E4" >
                        <h:column>
                            <f:facet name="header">
                                <h:outputLabel style="margin: 5px; text-align: left;" value="Banco"  />
                            </f:facet>
                            <f:facet name="footer">
                                <p:selectOneMenu value="#{contaBean.conta.banco}" 
                                                 converter="entityConverter" style="padding-left: 2px; width: 200px;">
                                    <f:selectItem itemLabel="Selecione um banco" itemValue="" noSelectionOption="true"/>
                                    <f:selectItems value="#{bancoBean.bancos}" var="banco" itemLabel="#{banco.nomeBanco}"/>
                                </p:selectOneMenu>
                            </f:facet>
                        </h:column>

                        <h:column>
                            <f:facet name="header">
                                <h:outputLabel style="margin: 5px; text-align: left;" value="Número da Agência"  />
                            </f:facet>
                            <f:facet name="footer">
                                <p:inputText style="width: 200px;" value="#{contaBean.conta.numeroAgencia}" 
                                             required="true" requiredMessage="Informe o número da conta.">
                                </p:inputText>
                            </f:facet>
                        </h:column>

                        <h:column>
                            <f:facet name="header">
                                <h:outputLabel style="margin: 5px; text-align: left;" value="Nome da Agência"  />
                            </f:facet>
                            <f:facet name="footer">
                                <p:inputText style="width: 200px;" value="#{contaBean.conta.agencia}" 
                                             required="true" requiredMessage="Informe o nome da agência.">
                                </p:inputText>
                            </f:facet>
                        </h:column>
                      </h:dataTable>
                  </p:panel>
                  <p:panel rendered="#{contaBean.exibirDadosBancarios}">
                      <h:dataTable styleClass="dadosForm" style="border: 1px solid #E4E4E4" >
                        <h:column>
                            <f:facet name="header">
                                <h:outputLabel style="margin: 5px; text-align: left;" value="Número da Conta"  />
                            </f:facet>
                            <f:facet name="footer">
                                <p:inputText style="width: 200px;"  value="#{contaBean.conta.agencia}" 
                                             required="true" requiredMessage="Informe o número da conta.">
                                </p:inputText>
                            </f:facet>
                        </h:column>

                        <h:column>
                            <f:facet name="header">
                                <h:outputLabel style="margin: 5px; text-align: left;" value="Gerente"  />
                            </f:facet>
                            <f:facet name="footer">
                                <p:inputText style="width: 200px;"  value="#{contaBean.conta.gerente}" 
                                             required="true" requiredMessage="Informe o nome do Gerente.">
                                </p:inputText>
                            </f:facet>
                        </h:column>
                     </h:dataTable>
                </p:panel><br/>
                <p:commandButton value="Gravar" actionListener="#{contaBean.gravar()}" ajax="false"/>
                <p:commandButton value="Encerrar Conta" actionListener="#{contaBean.encerrarConta}"  rendered="#{not empty contaBean.conta.id}" ajax="false" />
                <p:commandButton value="Voltar" action="#{contaBean.voltar()}" immediate="true" ajax="false"/>      
            </h:form>  
        </ui:define>
    </ui:composition>
</html>

